import SortTab from "./components/SortTab";
import SupplierList from "./components/SupplierList";
import NotFoundProduct from "../common/comps/NotFoundProduct";
import REST from "@module/Rest";
import Uts from "@module/Uts";
import Pagination from "@ui/RJMart/pagination";
import ToastUtils from '@page/common/utils/ToastUtils'

import "@page/common/css/commheader.css";
import "./style.scss";

class SearchResults extends React.Component {
    constructor() {
        super();
        this.state = {
            supplierList: [],
            supplierName: $state.params && $state.params.supp,
            total: 0,
            pageNo: 1,
            orderType: 0,
            isLoading: true
        };
        this.searchSupplier = this.searchSupplier.bind(this);
    }

    componentDidMount() {
        this.searchSupplier();
    }

    searchSupplier(add) {
        let url = global.hasLogin
            ? `/search/supp/org`
            : `/search/supp/platform`;
        let params = {
            supplierName: this.state.supplierName,
            pageSize: 10,
            pageNo: this.state.pageNo,
            orderType: this.state.orderType,
            city:add
        };
        if (global.hasLogin) {
            params.orgId = Uts.getCookie("orgId");
        }
        ToastUtils.loading()
        REST.post(url, params)
            .then(res=>{
                ToastUtils.hide()
                if (res.message == "success") {
                    this.setState({
                        supplierList: res.suppliers,
                        total: res.total,
                        isLoading: false
                    });
                }
            })
            .catch(err=>{
                ToastUtils.hide()
                this.setState({
                    isLoading: false
                });
            });
    }



    handleChange = pageNo => {
        this.setState({
            pageNo: pageNo
        },this.searchSupplier);
    };

    sort=(id)=>{
        console.log(id);
        this.setState({
            orderType: id
        },this.searchSupplier);
    }


    componentWillUpdate() {
        let hash = window.location.hash;

        if (hash != this.hash) {
            this.setState({
                supplierName:$state.params && $state.params.supp
            },this.searchSupplier)

        }
    }

    setCity=(city)=>{
        this.searchSupplier(city);
        
    }

    render() {
        this.hash=window.location.hash

        const { supplierList, total, pageNo,orderType, isLoading } = this.state;
        return (
            <div className="rj_l-search_results">
                <SortTab setCity={this.setCity} sortList={this.sort} total={total} orderType={orderType}/>
                {supplierList.length > 0 &&
                    supplierList.map((item, index) => {
                        return (
                            <SupplierList
                                key={index}
                                hideBottomLine={
                                    index == supplierList.length - 1
                                }
                                info={item}
                            />
                        );
                    })}
                {(!isLoading&&supplierList.length === 0) && <NotFoundProduct />}

                {(!isLoading&&total)?
                    <Pagination
                        pageSize={10}
                        total={total}
                        current={pageNo}
                        onChange={this.handleChange}
                    />
                    :
                    ''
                }

                <div style={{ height: 77 }} />
                <div className={"app-footer-top-line"} />
            </div>
        );
    }
}

export default SearchResults;
// ReactDOM.render(<SearchResults/>,document.getElementById('reactRoot'))
